// 评论列表组件
<template>
  <!-- 评论区域 -->
  <div class="comment-box">
    <div class="comment-region">
      <div class="region-box" v-for="(item, index) in dataList" :key="index" :style="indent">
        <van-row type="flex" justify="space-between">
          <van-col>
            <div class="img-box" @click="dot(item)">
              <img :src="item.portrait?item.portrait:'https://gw.alicdn.com/tfs/TB15Q0lOmzqK1RjSZFHXXb3CpXa-400-400.png'" width="100%" height="100%" alt="">
            </div>
          </van-col>
          <van-col class="van-hairline--bottom" style="width:100%">
            <van-row type="flex" justify="space-between" align="center">
              <van-col>
                <i class="comment-user" @click="toggle(item, index)">{{item.user_name}}
                  <span v-if="item.children">({{item.children.length}}条回复)</span>
                </i>
              </van-col>
              <van-col>
                <i class="comment-num">
                  <i v-if="item.islike==0" class="iconfont icon-dianzan1" @click="give_abulous(item)"></i>
                  <i v-if="item.islike==1" style="color:#01A0EF" class="iconfont icon-dianzan1" @click="over"></i>
                  <span>{{ item.like_nums || 0 }}</span>
                </i>
                <i class="comment-num">
                  <i class="iconfont icon-xiaoxi" @click="post_comment(item)"></i>
                  <span>{{ item.child_sum || 0 }}</span>
                </i>
              </van-col>
            </van-row>
            <p class="date-num">
              <i class="comment-date">{{ item.create_time }}</i>
            </p>
            <p class="comment-content">{{ item.comment_content }}
            </p>
          </van-col>
        </van-row>
        <tree-menu v-if="scope[index]" :depth="depth + 1" :dataList="item.children"></tree-menu>
      </div>
    </div>
  </div>
</template>

<script>
import { articleComment_addLike } from "@/api/articleComment";
import { proposalComment_addLike } from "@/api/proposalComment";
import Nodata from "../../public/nodata/Nodata"; // 导入暂无数据组件
import { clacTime } from "@/utils";
import { setTimeout } from "timers";

export default {
  // 通过 porps 来接收父组件中传递过来的属性
  name: "tree-menu",
  props: ["dataList", "depth", "datainfo"],
  components: { Nodata },
  data() {
    return {
      isShow: false,
      isHide: false,
      scope: {},
      listQuery: {}
    };
  },
  computed: {
    indent() {
      return { transform: `translate(${this.depth * 8}px)` };
    }
  },
  methods: {
    //点赞
    give_abulous(item) {
      if (this.$route.query.name == "article") {
        this.listQuery = {
          id: item.id,
          article_id: item.article_id,
          company_id: localStorage.getItem("companyId") - 0
        };
      } else {
        this.listQuery = {
          id: item.id,
          proposal_id: item.proposal_id,
          company_id: localStorage.getItem("companyId") - 0
        };
      }
      this.oneAbulous();
    },
     dot(item){
         this.$router.push({
             path:'/giveLike',
             query:{id:item.id}
         })
    },
    over(){
       this.$toast('您已经点赞过了不能重复点赞')
    },
    async oneAbulous() {
      let query = Object.assign({}, this.listQuery);
      let res = this.$route.query.name == "article" ? await articleComment_addLike(query) : await proposalComment_addLike(query);
      let result = res.data;
      if (result.status == 100) {
        this.$toast.success("点赞成功");
        this.$emit("initList");
      }
    },
    //回复评论
    post_comment(item) {
      console.log(item);
    //   if (this.datainfo.audit_status || this.datainfo.comment_status) {
        this.$store.dispatch( "SetHidden",true );
        let replyinfo = {}
        if (this.$route.query.name == 'article') {
          replyinfo = {
            parent_id: item.id,
            article_id: item.article_id,
            comment_content: "",
            like_nums: 0,
            company_id: localStorage.getItem("companyId") - 0
          }
        } else {
          replyinfo = {
          parent_id: item.id,
          proposal_id: item.proposal_id,
          comment_content: "",
          like_nums: 0,
          company_id: localStorage.getItem("companyId") - 0
          }
        }
        this.$store.dispatch( "SetCommenInfo",replyinfo );
        this.$emit("initList");
    //   }
    },
    //展开评论
    toggle(item, index) {
      if (item.children && item.children.length) {
        this.doTask(index);
      }
    },
    doTask(index) {
      this.$set(this.scope, index, !this.scope[index]);
    }
  },
  created() {
  },
  mounted() {
    this.dataList.map(item => {
      return Object.assign({}, item, {
        create_time: clacTime(item.create_time)
      });
    });
  }
};
</script>

<style lang="scss" scoped>
@import "Comment";
</style>
